<template>
  <div class="publish-state-switch align-center">
    <el-switch
      v-model="value_"
      :active-value="PublishState.PUBLICSHED"
      :inactive-value="PublishState.UNPUBLICSHED"
    />
  </div>
</template>

<script>
  import { constUtils } from '../../mixin'

  export default {
    name: 'PublishStateSwitch',
    mixins: [constUtils],
    model: {
      prop: 'value',
      event: 'change'
    },
    props: {
      value: {
        type: [Boolean, String, Number],
        default: false
      }
    },
    data() {
      return {
        value_: false
      }
    },
    computed: {},
    watch: {
      value() {
        this.value_ = this.value
      },
      value_(val) {
        this.$emit('change', val)
      }
    },
    created() {
      this.value_ = this.value
    }
  }
</script>
